<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>Title</title>
		<style type="text/css">
			body {
				height: 8000px;
			}
			a {
				color: #fff;
			}
			.actGotop {
				position: fixed;
				bottom: 50px;
				right: 50px;
				width: 150px;
				height: 195px;
				display: none;
				z-index: 100;
			}
			.actGotop a, .actGotop a:link {
				width: 150px;
				height: 195px;
				display: inline-block;
				background: url(images/gotop.png) no-repeat;
				outline: none;
			}
			.actGotop a:hover {
				width: 150px;
				height: 195px;
				background: url(images/gotop.gif) no-repeat;
				outline: none;
			}
		</style>
	</head>
	<body>
		<div class="actGotop"><a href="javascript:;" title="Top"></a></div>
		<script src="jquery-1.12.4.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			$(function(){
				//当页面超出去1000px的时候,让小火箭显示出来,
				//如果小于1000,就让小火箭隐藏
				$(window).scroll(function(){
					if($(window).scrollTop() >= 1000) {
						$(".actGotop").stop().fadeIn(1000);
					}else {
						$(".actGotop").stop().fadeOut(1000);
					}
				});
// 				function getScroll() {
// 					return {
// 						left: window.pageYOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0,
// 						top: window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0
// 					}
// 				}
				//在外面注册
				$(".actGotop").click(function(){
					$("html,body").stop().animate({scrollTop:0},3000);
					// scrollTop为0
					$(window).scrollTop(0);
				})
			});
		</script>
	</body>
</html>